<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>冒险起源</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-3.7.1.min.js" type="text/javascript"></script>
<script src="js/custom.js" type="text/javascript"></script>
</head>
<body>
<!--header-->
<div class="header" style="background: url(images/in_tu_01.png) center; background-size:100%;">
	<div class="header_bar"></div>
    <div class="task_show_top">
        <div class="show_tit y_center">
        	<a href="javascript:;" class="prev x_center y_center"><i class="m_icon"></i></a>
            <div class="name y_center">
                <span class="pic"><img src="images/weixin.png" /></span><span>微信区</span><span class="ml10">泰拉车 123456</span>
            </div>
        </div>
        <div class="clear_h40"></div>
        <div class="info_label x_start y_center">
            <em class="lab_36f">>200万泰拉</em>
            <em class="lab_e00">比例5000</em>
            <!--<em class="lab_e00">房间金额：¥50</em>-->
        </div>
        <div class="clear_h10"></div>
        <div class="x_start_end y_center">
        	<a href="javascript:;" class="show_url y_center show_pop_gameurlstep"><i class="m_icon mr5"></i>暂未配置游戏房间链接</a><!--房主点击弹窗配置链接，其他玩家点击弹窗配置链接步骤-->
            <div class="show_time y_center">等候中<span class="ml5 time">00:01:30</span></div>
        </div>
        <div class="clear_h5"></div>
    </div>
</div>
<!---->
<div class="task_show">
    <div class="clear_bb"></div>
	<div class="player_list x_start flex_wrap">
        <a href="javascript:;" class="li_box x_start y_center">
            <div class="role role_a">卖家</div><!--role_a卖家/老板，role_b一队/打手，role_c甲板/混子-->
            <div class="info">
                <div class="x_start y_center">
                    <div class="user_face"><img src="images/role_face/role_face_guijian_01.png" /></div>
                    <div class="name ml5">4.3 武神</div>
                </div>
                <div class="color_999 t_ellipsis_1 fs12">角色名称角色名称角色名称</div>
            </div>
        </a>
        <a href="javascript:;" class="li_box x_start y_center on"><!--自己的角色，加on-->
            <div class="role role_b">打手</div>
            <div class="info">
                <div class="x_start y_center">
                    <div class="user_face"><img src="images/role_face/role_face_guijian_01.png" /></div>
                    <div class="name ml5">4.3 武神</div>
                </div>
                <div class="color_999 t_ellipsis_1 fs12">角色名称</div>   
            </div>
        </a>
        <a href="javascript:;" class="li_box x_start y_center">
            <div class="role role_c">混子</div>
            <div class="info">
                <div class="x_start y_center">
                    <div class="user_face"><img src="images/role_face/role_face_guijian_01.png" /></div>
                    <div class="name ml5">4.3 武神</div>
                </div>
                <div class="color_999 t_ellipsis_1 fs12">角色名称</div> 
            </div>
        </a>
        <a href="javascript:;" class="li_box x_start y_center">
            <div class="role role_c">混子</div>
            <div class="info">
                <div class="x_start y_center">
                    <div class="user_face"><img src="images/role_face/role_face_guijian_01.png" /></div>
                    <div class="name ml5">4.3 武神</div>
                </div>
                <div class="color_999 t_ellipsis_1 fs12">角色名称</div>   
            </div>
        </a>
        <a href="javascript:;" class="li_box x_start y_center">
            <div class="role role_c">混子</div>
            <div class="info">
                <div class="x_start y_center">
                    <div class="user_face"><img src="images/role_face/role_face_guijian_01.png" /></div>
                    <div class="name ml5">4.3 武神</div>
                </div>
                <div class="color_999 t_ellipsis_1 fs12">角色名称</div>  
            </div>
        </a>
        <a href="javascript:;" class="li_box x_start y_center">
            <div class="role role_c">混子</div>
            <div class="add_player x_center y_center"><i class="m_icon add"></i>加入位置</div>
        </a>
        
    </div>
    
    <div class="task_show_remark x_start y_center">
    	
        <i class="m_icon remark mr5"></i>
        <div class="text">30秒真男人，极速刷图</div>
        <div class="pic">
        	<img src="images/in_tu_01.png" />
            <img src="images/in_tu_01.png" />
        </div>
    </div>
    
    <div class="mess_list">
    	<div class="warn_list">
        	<div class="li_box">※【房主】左上角完成游戏链接配置，或游戏拉人</div>
            <div class="li_box">※【房主】游戏人齐点开始，团本通关点完成结算</div>
        </div>
        <div class="chat_list">
        	<div class="li_box y_start">
            	<div class="user_info y_center">
                	<img src="images/role_face/role_face_guijian_01.png" />
                    <span class="role role_a">管理员</span><!--role_a管理员，role_b卖家/老板，role_c打手/一队，role_d混子/甲板-->
                </div>
                <div class="con">混子/打手禁止抢拍，否则账号永久封禁！</div>
            </div>
            <div class="li_box y_start">
            	<div class="user_info y_center">
                	<img src="images/role_face/role_face_guijian_01.png" />
                    <span class="role role_b">卖家</span>
                    <span class="name">角色名称：</span>
                </div>
                <div class="con">链接已配置，进图</div>
            </div>
            <div class="li_box y_start">
            	<div class="user_info y_center">
                	<img src="images/role_face/role_face_guijian_01.png" />
                    <span class="role role_c">打手</span>
                    <span class="name">角色名称：</span>
                </div>
                <div class="con">直接拉我直接拉我直接拉我直接拉我直接拉我直接拉我</div>
            </div>
            <div class="li_box y_start">
            	<div class="user_info y_center">
                	<img src="images/role_face/role_face_guijian_01.png" />
                    <span class="role role_d">混子</span>
                    <span class="name">角色名称：</span>
                </div>
                <div class="con">直接拉我</div>
            </div>
            
        </div>
    </div>
    
    <div class="order_info border_t y_center">
        <div class="con_box">
        	<div class="li_box y_center">
                <div class="name">结算图：</div>
                <div class="info">
                    <div class="pic x_center y_center">
                        <img src="images/in_tu_01.png" />
                        <img src="images/in_tu_01.png" />
                    </div>
                </div>
            </div>
            <div class="li_box y_center">
                <div class="name">组队时间：</div>
                <div class="info">2025-08-05 15:05</div>
            </div>
            <div class="li_box y_center">
                <div class="name">累计用时：</div>
                <div class="info">15分钟</div>
            </div>
            <div class="li_box y_center x_start_end">
            	<div class="y_center">
                    <div class="name">预计费用：</div>
                    <div class="info">20.00元</div>
                    <i class="m_icon prob show_pop_jiesuan ml5"></i>
                </div>
                <div class="page_btn_sub x_start_end y_center">
                    <a href="javascript:;" class="btn btn_small btn_oline btnc_36f y_center"><i class="m_icon kefu"></i>联系客服</a>
                    <a href="task_order.html" class="btn btn_small btn_bg btnc_36f">查看结算单</a>
                </div>
            </div>
            
            
        </div>
        <div class="state"><img src="images/state_c.png" /></div><!--state_d结算中，state_c已完成-->
    </div>
    
</div>

<!--弹窗，配置链接-->
<div class="js_dialog js_dialog_gameurlstep">
	<div class="pop_box pop_down_box pop_iframe_box pop_gameurlstep_box">
        <div class="pop_tit y_center">
        	<h3>如何创建游戏房间链接</h3>
            <i class="m_icon pop_close pop_gameurlstep_close"></i>
        </div>
        <div class="con_box">
            <iframe src="page_news_gameurl.html" class="page_iframe"></iframe>
        </div>
        <div class="clear_h10"></div>
        
    </div>
</div>

<!--弹窗，结算规则-->
<div class="js_dialog js_dialog_jiesuan">
	<div class="pop_box pop_down_box pop_iframe_box pop_jiesuan_box">
        <div class="pop_tit y_center border_b">
        	<h3>任务结算规则</h3>
            <i class="m_icon pop_close pop_jiesuan_close"></i>
        </div>
        <div class="con_box">
            <iframe src="page_news_jiesuan.html" class="page_iframe"></iframe>
        </div>
        <div class="clear_h10"></div>
        
    </div>
</div>

<script>
$().ready(function(){
	
	//角色
	var player_li_ml=10;
	var player_li_w=parseInt(($(".player_list").width()/3-player_li_ml/3*2)*10)/10; 
	$(".player_list .li_box").css({"width":player_li_w,"margin-left":player_li_ml});
	
	//筛选下拉
	attr_filter({
		more:".mess_btn",
		more_updown:1,
	});
	
	//mess_list滚动
	$(".mess_list").outerHeight($(window).height()-$(".header").outerHeight(true)-$(".player_list").outerHeight(true)-$(".task_show_remark").outerHeight(true)-$(".order_info").outerHeight(true)-20);
	//聊天内容滚动到最后一条
	$(".mess_list").animate({
		scrollTop:$(".mess_list").find(".li_box").last().position().top
	},200);
		
	//弹窗，配置链接步骤
	pop_box_c({
		show_btn:".show_pop_gameurlstep",
		zz:".js_dialog_gameurlstep",
		box:".pop_gameurlstep_box",
		close:".pop_gameurlstep_close",
		body_close:true
	});
	
	//弹窗，结算规则
	pop_box_c({
		show_btn:".show_pop_jiesuan",
		zz:".js_dialog_jiesuan",
		box:".pop_jiesuan_box",
		close:".pop_jiesuan_close",
		body_close:true
	});
	
});

</script>
</body>
</html>
